.state-widget {
  padding: 24px;

  .value {
    font-size: 36px;
    margin-top: 12px;
    margin-bottom: 12px;
    line-height: 1;
  }

  .property {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 14px;
  }

  .icon {
    margin-top: -8px;
  }

  .percent {
    font-size: 14px;
  }

  .change-icon {
    font-weight: 700;
    margin-left: 2px;
  }
}

@mixin icon-size($size: 24) {
  .icon-size-#{$size} {
    font-size: #{$size}px;
    height: #{$size}px;
    width: #{$size}px;
    line-height: #{$size}px;
  }
}

@include icon-size(18);
@include icon-size(38);
